<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>优田儿童成长中心</title>
    <link href="/static/assets/fontAwesome/css/fontawesome-all.min.css" rel="stylesheet">
    <link href="/static/assets/css/lib/themify-icons.css" rel="stylesheet">
    <link href="/static/assets/css/lib/mmc-chat.css" rel="stylesheet"/>
    <link href="/static/assets/css/lib/sidebar.css" rel="stylesheet">
    <link href="/static/assets/css/lib/bootstrap.min.css" rel="stylesheet">
    <link href="/static/assets/css/lib/nixon.css" rel="stylesheet">
    <link href="/static/assets/lib/lobipanel/css/lobipanel.min.css" rel="stylesheet">
    <link href="/static/assets/css/style.css" rel="stylesheet">
</head>

<body>
<div class="sidebar sidebar-hide-to-small sidebar-shrink sidebar-gestures">
    <div class="nano">
        <div class="nano-content">
            <ul>
                <li class="active">
                    <a href="/home/" id="stats-btn"><i class="ti-bar-chart"></i> 统计数据<span
                            class="sidebar-collapse-icon ti-angle-right"></span></a>
                </li>
                <li>
                    <a href="/teacher/"><i class="ti-user"></i> 教师管理</a>
                </li>
                <li>
                    <a href="/child/"><i class="ti-user"></i> 幼儿管理</a>
                </li>
                <li>
                    <a href="/posts/"><i class="ti-desktop"></i> 岗位管理</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="header">
    <div class="pull-left">
        <div class="logo">
            <a>
                <img id="logoImg" src="/static/img/yt1.png" data-logo_big="/static/img/yt1.png"
                     data-logo_small="/static/img/yt3.png" alt="Nixon"/>
            </a>
        </div>
        <div class="hamburger sidebar-toggle">
            <span class="ti-menu"></span>
        </div>
    </div>
    <div class="pull-right p-r-15">
        <ul>
            <li class="header-icon dib">
                <img class="avatar-img" src="/static/assets/images/avatar/1.jpg" alt=""/> <span
                    class="user-avatar"><span th:text="${session.username}"></span>&nbsp;&nbsp;&nbsp;<i
                    class="ti-angle-down f-s-10"></i></span>
                <div class="drop-down dropdown-profile">
                    <div class="dropdown-content-body">
                        <ul>
                            <li><a href="/exit/"><i class="ti-power-off"></i> <span>注销</span></a></li>
                        </ul>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>
<div class="content-wrap">
    <div class="main">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-8 p-0">
                    <div class="page-header">
                        <div class="page-title">
                            <h1>统计数据</h1>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 p-0">
                    <div class="page-header">
                        <div class="page-title">
                            <ol class="breadcrumb text-right">
                                <li class="active">主页</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
            <div class="main-content">
                <div class="row">
                    <div class="col-lg-3">
                        <div class="card">
                            <div class="stat-widget-two">
                                <div class="widget-icon color-1">
                                    <i class="fas fa-users"></i>
                                </div>
                                <div class="stat-content">
                                    <div class="stat-text">教师人数</div>
                                    <div class="stat-digit">0</div>
                                </div>
                                <div class="progress">
                                    <div class="progress-bar progress-bar-success" role="progressbar"
                                         aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
                                         style="width: 100%;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="card">
                            <div class="stat-widget-two">
                                <div class="widget-icon color-4">
                                    <i class="fas fa-users"></i>
                                </div>
                                <div class="stat-content">
                                    <div class="stat-text">幼儿人数</div>
                                    <div class="stat-digit">0</div>
                                </div>
                                <div class="progress">
                                    <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="100"
                                         aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="card">
                            <div class="stat-widget-two">
                                <div class="widget-icon color-3">
                                    <i class="fas fa-tasks"></i>
                                </div>
                                <div class="stat-content">
                                    <div class="stat-text">缴费人数</div>
                                    <div class="stat-digit">0</div>
                                </div>
                                <div class="progress">
                                    <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="10"
                                         aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3">
                        <div class="card">
                            <div class="stat-widget-two">
                                <div class="widget-icon color-2">
                                    <i class="fas fa-credit-card"></i>
                                </div>
                                <div class="stat-content">
                                    <div class="stat-text">总缴费金额数</div>
                                    <div class="stat-digit"><i class="fa fa-dollar-sign"></i>0</div>
                                </div>
                                <div class="progress">
                                    <div class="progress-bar progress-bar-primary" role="progressbar"
                                         aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
                                         style="width: 100%;"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            Copyright &copy; 2024
        </div>
    </div>
</div>
<script src="/static/assets/js/lib/jquery.min.js"></script>
<script src="/static/assets/js/lib/jquery.nanoscroller.min.js"></script>
<script src="/static/assets/js/lib/sidebar.js"></script>
<script src="/static/assets/js/lib/bootstrap.min.js"></script>
<script src="/static/assets/js/lib/mmc-common.js"></script>
<script src="/static/assets/js/lib/mmc-chat.js"></script>
<script src="/static/assets/js/lib/chart-js/Chart.bundle.js"></script>
<script src="/static/assets/js/lib/chart-js/chartjs-init.js"></script>
<script src="/static/assets/js/lib/datamap/d3.min.js"></script>
<script src="/static/assets/js/lib/datamap/topojson.js"></script>
<script src="/static/assets/js/lib/datamap/datamaps.world.min.js"></script>
<script src="/static/assets/js/lib/datamap/datamap-init.js"></script>
<script src="/static/assets/lib/lobipanel/js/lobipanel.js"></script>
<script src="/static/assets/js/scripts.js"></script>
<script>
    $(document).ready(function () {
        //location.href='/teacher/'
        $('#lobipanel-custom-control').lobiPanel({
            reload: false,
            close: false,
            editTitle: false
        });
    });
</script>
<script>
    $(document).ready(function () {
        $('#lobipanel-custom-control').lobiPanel({
            reload: false,
            close: false,
            editTitle: false
        });

        function refreshStats() {
            $.ajax({
                url: "/data/stats",
                method: "GET",
                success: function (data) {
                    $(".stat-digit").eq(0).text(data.tnum || 0);
                    $(".stat-digit").eq(1).text(data.cnum || 0);
                    $(".stat-digit").eq(2).text(data.pnum || 0);
                    $(".stat-digit").eq(3).text(data.total || 0);
                },
                error: function () {
                    console.log("获取统计数据失败");
                }
            });
        }

        refreshStats();
    });
</script>
<style>
    .copyrights {
        text-indent: -9999px;
        height: 0;
        line-height: 0;
        font-size: 0;
        overflow: hidden;
    }
</style>
<div class="copyrights">
    <h3>&copy; 版权所有 | </h3>
</div>
</body>
</html>